
  <style type="text/css">
   
   .textbox
	{
	  width:200px;
	}
	select
	{
	 width:200px;
	}
	label
	{
		margin-top:10px;
	}
	.fill
	{
		margin-top:10px;
	}
	.title
	{
	  background-color:#CCCCCC;
	  text-align:left;
	  width:700px;
	  height:20px;
	  padding:2px;
	  margin-top:10px;
	  
	}
	.divleft
	{
	 margin-left:250px;
	 margin-top:-35px;
	}
	div #transactioninfo,div #propertyinfo,div #purchaseinfo
	{
	 margin-top:10px;
	}
	div #refinanceinfo,div #closinginfo
	{
		display:none;
	}
  </style>
  <script type="text/javascript" src="jquery-1.2.3.pack.js"></script>
 
<form id="form1" name="form1" method="post" action="action/index.php">
 <div style="width:700px;">
  The documentary stamp deed taxes are typically paid by the seller; the mortgage stamp deed taxes is paid by the buyer.
 </div>
  <input type="hidden" name ="state" value="de"/>
  <div id="transactioninfo">
   
    <div class="title">Transaction Info</div>
    <div >
	 <label>Transaction Type:</label><br />
	 <select name="transaction_type" class="cbtransaction">
	   <option value="Purchase">Purchase</option>
	   <option value="Refinance" >Refinance</option>
	 </select>
	</div>
 </div>
  <div id="propertyinfo">
    <div class="title">Property Info</div>
    <div>
	<div>
	  <label>County:</label><br />
	  <select name="county_locale" id="county_locale">
	    <option value="Kent">Kent</option>
	    <option value="New Castle" >New Castle</option>
	    <option value="Sussex" >Sussex</option>
	  </select>
	 </div>
	 <div class="divleft">
	  <label>Town Locale:</label><br />
	  <select name="town_locale" id="town_locale">	    
	  </select>
	 </div>
	 <div>
	   <label>Primary Residence:</label><br />
	   <input type="radio" name="primary_residence" value="1"/> Yes
	   <input type="radio" name="primary_residence" value="0" checked="checked"/> No
	 </div>
    </div>
  </div>
  <div id="purchaseinfo">
		<div class="title">Purchase Info</div>
		<div class="fill">
		   <label>Purchase Price:</label><br />
		   <input class="textbox" type="text" name="purchase_price" id="purchaseprice" /> 
		 </div>
		 <div>
		    <label>1st Loan Amount:</label><br />
		    <input class="textbox" type="text" name="loan_amount1" id="loan_amount1" /> 
		 </div>
		 <div class="divleft">
		    <label>2nd Loan Amount:</label><br />
		    <input class="textbox" type="text" name="loan_amount2" id="loan_amount2" /> 
		 </div>
		  <div class="fill">
		    <label>Enhanced coverage:</label><br />
		    <input type="radio" name="enhanced_coverage" value="1" checked="checked"/> Yes
	        <input type="radio" name="enhanced_coverage" value="0" /> No
		 </div>
		  <div class="fill">
		 	 <label>First time home buyer:</label><br />
		 	 <input type="radio" name="home_buyer" value="1"/> Yes
	    	 <input type="radio" name="home_buyer" value="0" checked="checked"/>No
		 </div>
		  <div class="divleft">
		       <label>Who Pays:</label><br />
		  <select name="payer" >
                          <option value="Default">Default</option>
                          <option value="Seller" >Seller Pays</option>
                          <option value="Buyer">Buyer Pays</option>
                          <option value="Split50" >Split 50-50</option>
                      </select>
		 </div>

   </div>
   <!---->
    <div id="refinanceinfo">
		<div class="title">Refinance Info</div>
		
		 <div class="fill">
		    <label>1st New Loan Amount:</label><br />
		    <input class="textbox" type="text" name="loan_amount3" id="loan_amount3" /> 
		 </div>
		 <div class="divleft">
		    <label>2nd New Loan Amount (if applicable):</label><br />
		    <input class="textbox" type="text" name="loan_amount4" id="loan_amount4" /> 
		 </div>
		  <div class="fill">
		    <label>The policy was issued within past 5 years:</label><br />
		 	 <input type="radio" name="pass_policy" value="1" /> Yes
	    	 <input type="radio" name="pass_policy" value="0" checked="checked"/>No
		 </div>
		 <div class="divleft">
		    <label>Policy Amount:</label><br />
		    <input class="textbox" type="text" name="amount_policy" id="amount_policy" /> <br />
			
		 </div>		 
   </div>
   <!---->
   <div id="closinginfo">
  
    <div class="title">Closing Info</div>
    <div class="fill">
	 <label>Closing location:</label><br />
	 <select name="mobile_closing">
	   <option value="0">Household Title & Escrow Office</option>
	   <option value="1" >Mobile Closing</option>
	 </select>
	</div>
 </div>
  <div id="buttoninfo">
   <button id="btpre"> PreviousPage </button>
      <input type="submit" value="Calculate Good Faith Estimate" name="btcalculator" id="btcalculator" />
   <button id="btnext"> NextPage</button>
 </div>


</form>

  <script type="text/javascript">
     var arraykent = new Array("Dover","Farmington","Felton","Hartly","Kenton","Little Creek","Milford","Woodside", "All Others");
     var arraynewcastle = new Array("Arden","Ardencroft","Ardentown","Bellefonte","Delaware City","Middleton", "New Castle City","Newark","All Others");
     var arraysussex = new Array("Delmar","Ellendale","Georgetown","Greenwood","Laurel","Lincoln","Milford", "Prime Hook Beach","Seaford","All Others");
     jQuery(document).ready(function()
	 {				
				
				
	   jQuery(".cbtransaction").change(function () {
				 
          if ( $('.cbtransaction option:selected').text()=='Refinance')
          {
                  $("#purchaseinfo").css('display','none');
                  $("#refinanceinfo").css('display','block');
                  $("#closinginfo").css('display','block');
          } 
          else
          {
                  $("#purchaseinfo").css('display','block');
                  $("#refinanceinfo").css('display','none');
                  $("#closinginfo").css('display','none');
          }
         }).change();
            /////////////
            
            jQuery("#county_locale").change(function () {
                
            $('#town_locale').empty();
              if ( $('#county_locale option:selected').text()=='Kent')
              {
                  for(var i =0;i<arraykent.length;i++)
                    {
                        $('#town_locale').append(new Option(arraykent[i], arraykent[i], true, false));
                        /*
                         *cach 2
                        //var options = $('#example').attr('options');
                       // options[options.length] = new Option('Foo', 'foo', true, true);
                        */  
                    }
              }
              else if ( $('#county_locale option:selected').text()=='New Castle')
               {
                    for(var i =0;i<arraynewcastle.length;i++)
                    {
                        $('#town_locale').append(new Option(arraynewcastle[i], arraynewcastle[i], true, false));
                        /*
                         *cach 2
                        //var options = $('#example').attr('options');
                       // options[options.length] = new Option('Foo', 'foo', true, true);
                        */  
                    }
                      
               }
               else if ( $('#county_locale option:selected').text()=='Sussex')
               {
                    for(var i =0;i<arraysussex.length;i++)
                    {
                        $('#town_locale').append(new Option(arraysussex[i], arraysussex[i], true, false));
                        /*
                         *cach 2
                        //var options = $('#example').attr('options');
                       // options[options.length] = new Option('Foo', 'foo', true, true);
                        */  
                    }  
               }
	   }).change();


            
	});

   </script>